<template>
    <a-modal
        v-model:visible="bindVisible"
        :title="$t('batchDeleteTaskLog.batchDelete')"
        :cancelText="$t('operation.cancel')"
        :okText="$t('operation.confirm')"
        @ok="confirm"
    >
      <a-form layout="vertical">
        <a-form-item :label="$t('batchDeleteTaskLog.project')">
          <a-select :placeholder="$t('operation.defaultAll')" v-model:value="form.projectId"
                    allow-clear>
            <a-select-option v-for="item in projects" :key="item.projectId">{{ item.projectName }}</a-select-option>
          </a-select>
        </a-form-item>
      </a-form>
      <a-form layout="vertical">
        <a-form-item :label="$t('batchDeleteTaskLog.mockHandler')">
          <a-select :placeholder="$t('operation.defaultAll')" v-model:value="form.handlerId"
                    :disabled="!form.projectId" allow-clear>
            <a-select-option v-for="item in handlers" :key="item.handlerId">{{ item.name }}</a-select-option>
          </a-select>
        </a-form-item>
      </a-form>
      <a-form layout="vertical">
        <a-form-item :label="$t('batchDeleteTaskLog.deleteType')">
          <a-select :placeholder="$t('operation.select')" v-model:value="form.deleteType" :defaultValue="1">
            <a-select-option v-for="item in DeleteTaskLogTypeOption" :key="item.value">{{getDeleteTaskLogTypeName(item.value) }}
            </a-select-option>
          </a-select>
        </a-form-item>
        {{form}}
      </a-form>
    </a-modal>
</template>

<script lang="ts" setup>
import {PropType} from 'vue'
import {BatchDeleteTaskLogParam, DeleteTaskLogTypeOption} from "@/store/taskLog";
import {getDeleteTaskLogTypeName} from "@/store/taskLog";

const props = defineProps({
  form: {type: Object as PropType<BatchDeleteTaskLogParam>, default: () => ({})},
  projects: {type: Object, default: () => ({})},
  projectIdHandlerInfoMap: {type: Object, default: () => ({})},
  handlers: {type: Object, default: () => ({})},
  visible: {type: Boolean, default: false},
})
const emit = defineEmits(['update:visible', 'ok'])
const bindVisible = ref(false)
watchEffect(() => (bindVisible.value = props.visible))
watchEffect(() => emit('update:visible', bindVisible.value))

const confirm = async () => {
  await request.post('/api/dynamic-mock/mock/task/log/del', props.form)
  bindVisible.value = false
  props.form.deleteType=1
  emit('ok')
}

</script>
